<template>
	<view>
		<u-navbar :autoBack="true" leftIconSize="40rpx"  title="会员奖励明细" :placeholder="true" bgColor="#fff" :titleStyle="{ fontSize: '30rpx' , fontWeight: 'bold'}"></u-navbar>
		<view class="searchBox">
			<view class="search">
				<input type="text" placeholder="请输入订单编号"/>
				<text>搜索</text>
			</view>
		</view>
		<view class="contentBox">
			<view class="noData" v-if="false">
				<image src="../../../static/images/order-noData.png"></image>
				<text>暂无数据~</text>
			</view>
			<view class="tableData">
				<view class="itemBox" @click="goMemberRewardsDetails">
					<text class="userName">Migou</text>
					<text class="orderTime">下单时间: 2024-01-01 11:05:07</text>
					<text class="orderNumber">订单编号: 1747817365976907776</text>
					<text class="orderAmount">订单金额: ￥1900.00</text>
					<text class="integral">积分: 13.60</text>
					<text class="currentIncome">本期收入抵用券:0.8415</text>
				</view>
				<view class="itemBox">
					<text class="userName">Migou</text>
					<text class="orderTime">下单时间: 2024-01-01 11:05:07</text>
					<text class="orderNumber">订单编号: 1747817365976907776</text>
					<text class="orderAmount">订单金额: ￥1900.00</text>
					<text class="integral">积分: 13.60</text>
					<text class="currentIncome">本期收入抵用券:0.8415</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				
			}
		},
		methods:{
			/**会员奖励详情**/
			goMemberRewardsDetails()
			{
				this.$Router.push({
					path:'/pages/merchant/voucher/memberRewardsDetails'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.searchBox{
		width: 100%;
		height: 100rpx;
		background-color: #fff;
		.search{
			width: calc(100% - 60rpx);
			float: left;
			margin-left: 30rpx;
			height: 70rpx;
			background-color: #f5f5f5;
			margin-top: 8rpx;
			border-radius: 10rpx;
			display: flex;
			align-items: center;
			input{
				flex: 1;
				font-size: 27rpx;
				margin-left: 15rpx;
			}
			text{
				width: 130rpx;
				height: 100%;
				line-height: 70rpx;
				float: right;
				text-align: center;
				font-size: 28rpx;
				color: #fff;
				background-color: #ffbc04;
				border-radius: 0rpx 10rpx 10rpx 0rpx;
			}
		}
	}
	.contentBox{
		width: 100%;
		position: absolute;
		top: 290rpx;
		bottom: 0;
		float: left;
		overflow-y: auto;
		.noData{
			width: 100%;
			height: 100%;
			float: left;
			image{
				width: 350rpx;
				height: 350rpx;
				margin-top: 200rpx;
				position: relative;
				left: 50%;
				margin-left: -175rpx;
			}
			text{
				width: 100%;
				height: 30rpx;
				line-height: 30rpx;
				float: left;
				font-size: 30rpx;
				font-weight: bold;
				color: #333132;
				text-align: center;
				margin-top: 20rpx;
			}
		}
		.tableData{
			width: 100%;
			height: auto;
			float: left;
			.itemBox{
				width: calc(100% - 60rpx);
				height: 275rpx;
				padding: 20rpx 30rpx;
				background-color: #fff;
				.userName{
					width: 100%;
					float: left;
					height: 55rpx;
					line-height: 55rpx;
					font-size: 31rpx;
					color: rgb(59, 59, 59);
					font-weight: 450;
				}
				.orderTime,.orderNumber,.orderAmount{
					width: 100%;
					float: left;
					height: 55rpx;
					line-height: 55rpx;
					font-size: 28rpx;
					color: rgb(59, 59, 59);
				}
				.integral{
					width: 50%;
					float: left;
					height: 55rpx;
					line-height: 55rpx;
					font-size: 28rpx;
					color: rgb(59, 59, 59);
				}
				.currentIncome{
					width: 50%;
					float: right;
					text-align: right;
					height: 55rpx;
					line-height: 55rpx;
					font-size: 28rpx;
					color: rgb(59, 59, 59);
				}
			}
			.itemBox::after{
				content: '';
				position: absolute;
				width: calc(100% - 60rpx);
				float: left;
				left: 30rpx;
				height: 1rpx;
				background-color: #f5f5f5;
				margin-top: 294rpx;
			}
		}
	}
</style>